{{!
  Copyright (c) HashiCorp, Inc.
  SPDX-License-Identifier: BUSL-1.1
~}}

<PkiPaginatedList @listRoute="keys.index" @list={{@keyModels}} @hasConfig={{@hasConfig}}>
  <:actions>
    {{#if @canImportKey}}
      <ToolbarLink @route="keys.import" @type="upload" data-test-pki-key-import>
        Import
      </ToolbarLink>
    {{/if}}
    {{#if @canGenerateKey}}
      <ToolbarLink @route="keys.create" @type="add" data-test-pki-key-generate>
        Generate
      </ToolbarLink>
    {{/if}}
  </:actions>
  <:description>
    <p class="has-padding">Below is information about the private keys used by the issuers to sign certificates. While
      certificates represent a public assertion of an identity, private keys represent the private part of that identity, a
      secret used to prove who they are and who they trust.</p>
  </:description>
  <:list as |keys|>
    {{#each keys as |pkiKey|}}
      <LinkedBlock class="list-item-row" @params={{array "keys.key.details" pkiKey.keyId}} @linkPrefix={{@mountPoint}}>
        <div class="level is-mobile">
          <div class="level-left">
            <div>
              <Icon @name="certificate" class="has-text-grey-light" />
              <span class="has-text-weight-semibold is-underline" data-test-key={{if pkiKey.keyName "name" "id"}}>
                {{or pkiKey.keyName pkiKey.id}}
              </span>
              <div class="is-flex-row has-left-margin-l has-top-margin-xs">
                {{#if pkiKey.keyName}}
                  <span class="tag has-text-grey-dark" data-test-key="id">{{pkiKey.id}}</span>
                {{/if}}
              </div>
            </div>
          </div>
          <div class="level-right is-flex is-paddingless is-marginless">
            <div class="level-item">
              <PopupMenu>
                <nav class="menu">
                  <ul class="menu-list">
                    <li>
                      <LinkTo
                        @route="keys.key.details"
                        @model={{pkiKey.keyId}}
                        @disabled={{not @canRead}}
                        data-test-key-menu-link="details"
                      >
                        Details
                      </LinkTo>
                    </li>
                    <li>
                      <LinkTo
                        @route="keys.key.edit"
                        @model={{pkiKey.keyId}}
                        @disabled={{not @canEdit}}
                        data-test-key-menu-link="edit"
                      >
                        Edit
                      </LinkTo>
                    </li>
                  </ul>
                </nav>
              </PopupMenu>
            </div>
          </div>
        </div>
      </LinkedBlock>
    {{/each}}
  </:list>

  <:empty>
    <EmptyState @title="No keys yet" @message="There are no keys in this PKI mount. You can generate or create one." />
  </:empty>

  <:configure>
    <EmptyState @title="PKI not configured" @message={{this.notConfiguredMessage}}>
      <LinkTo @route="configuration.create">
        Configure PKI
      </LinkTo>
    </EmptyState>
  </:configure>
</PkiPaginatedList>